import 'package:cached_network_image/cached_network_image.dart';
import 'package:fate_blind_box/ui/user/profile.dart';
import 'package:fate_blind_box/utils/common_widget.dart';
import 'package:flutter/material.dart';

import '../../im/person_info.dart';
import '../../network/Api.dart';
import '../../theme/theme_color.dart';
import '../../utils/provider.dart';
import '../../widget/icon_text.dart';

class ReadMeUI extends StatelessWidget {
  const ReadMeUI({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return const _ReadMeUIWidget();
  }
}

class _ReadMeUIWidget extends StatefulWidget {
  const _ReadMeUIWidget({Key? key}) : super(key: key);

  @override
  State<_ReadMeUIWidget> createState() => _ReadMeUIWidgetState();
}

class _ReadMeUIWidgetState extends State<_ReadMeUIWidget> {

  final _listData = [];
  final int _page = 1; //加载的页数
  bool isLoading = false;
  final ScrollController _scrollController = ScrollController();
  @override
  Widget build(BuildContext context) {

    return AppWidget.navTitleBar(
      bgColor: const Color(0xFFF9F9F9),
      title:"看过我的",
      childWidget: _listData.isNotEmpty?RefreshIndicator(
        onRefresh: _onRefresh,
        child: ListView.builder(
          controller: _scrollController,
          itemBuilder: (_, index) {
            if (index == _listData.length) {
              //加载更多
              return _getMoreWidget();
            } else {
              if (_listData?.isNotEmpty == true) {
                return _buildItems(
                    _listData?[index], index);
              } else {
                return Container();
              }
            }
          },
          itemCount:_listData.length,
        ),
      ):gettype(),
    );
  }

  @override
  void initState() {
    super.initState();
    _getMeLookList(_page);
    _scrollController.addListener(() {
      if (_scrollController.position.pixels ==
          _scrollController.position.maxScrollExtent) {
        _getMore();
      }
    });

    setState(() {});

  }

  _getMeLookList(int page) async {
    final res = await Api.getInstance().getReadMe(Provider.memberId);
    final data = res['data'];

    if (data != null) {
      List list = data;
      if (list.isNotEmpty) {
        _listData.clear();
        setState(() {
          _listData.addAll(list);
        });
      }
    }
  }

  @override
  _buildItems(Map map, int index) {
    return GestureDetector(
      onTap: () {
        if (map['id'].toString().isEmpty) return;
        Navigator.of(context).push(MaterialPageRoute(
            builder: (builder) => UserProfileUi(memberId:map['id'])));
      },
      child: _listData.isNotEmpty
          ? Container(
        height: 70,
        margin: const EdgeInsets.symmetric(horizontal: 12),
        decoration: BoxDecoration(
          border: Border(
              bottom: BorderSide(
                  color: ThemeColor.dividerColor, width: 1)),
        ),
        child: Row(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            // map["profilePhoto"] != null
            //     ?
            // ClipRRect(
            //   borderRadius: BorderRadius.circular(5),
            //   child: CachedNetworkImage(
            //     imageUrl: Provider.fixAvatar(map["profilePhoto"]),
            //     width: 50,
            //     height: 50,
            //     fit: BoxFit.fill,
            //   ),
            // )
            //     : Container(),
            Stack(

              children: [
                Container(
                  padding: const EdgeInsets.only(top: 10, left: 5),
                  child: ClipRRect(
                    borderRadius: BorderRadius.circular(11),
                    child: Image.network(
                      Provider.fixAvatar(map['profilePhoto']),
                      width: 50,
                      height: 50,
                      fit: BoxFit.cover,
                    ),
                  ),
                ),

                map['singleState'] == 1 ? Container(
                  padding: const EdgeInsets.only(top: 8),
                  child: Image.asset(
                    "images/ic_fdsbzh_out.png",
                    width: 64,
                    // height: 100,
                  ),
                ):Container(),
                // map['singleState'] == 1 ?Container(
                //   // alignment: Alignment.bottomRight,
                //     margin: const EdgeInsets.only(top: 0, left: 2),
                //     child: Stack(
                //       children: [
                //
                //         Image.asset(
                //           "images/ic_imgTop.png",
                //           width: 49,
                //         ),
                //         const Positioned(
                //           right: 3,
                //           child: Text('非单身',style: TextStyle(
                //             color: Colors.white,
                //             fontSize: 9,
                //           )),
                //         )
                //
                //       ],
                //     )
                // ):Container(),
                // map['singleState'] == 1 ? Container(
                //   // alignment: Alignment.bottomLeft,
                //     margin: const EdgeInsets.only(top: 36, right: 2),
                //     child:Stack(
                //       children: [
                //         Image.asset(
                //           "images/ic_imgBottom.png",
                //           width: 49,
                //           // height: 14,
                //         ),
                //         const Positioned(
                //           left: 3,
                //           child: Text('不征婚',style: TextStyle(
                //             color: Colors.white,
                //             fontSize: 9,
                //           )),
                //         )
                //
                //       ],
                //     )
                // ):Container(),
              ],
            ),

            const SizedBox(
              width: 12,
            ),
            Expanded(
              child: Container(
                padding: const EdgeInsets.symmetric(vertical: 10),
                child: Column(
                  mainAxisAlignment: MainAxisAlignment.spaceAround,
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Text(
                      map["nickName"] ?? "",
                      style: TextStyle(
                          color: ThemeColor.textColor,
                          fontSize: 15,
                          fontWeight: FontWeight.w600),
                    ),
                    Row(
                      mainAxisAlignment: MainAxisAlignment.start,
                      children: [
                        Container(
                          margin: const EdgeInsets.only(right: 8),
                          padding: const EdgeInsets.only(
                              left: 8, right: 8, top: 1, bottom: 1),
                          alignment: Alignment.center,
                          decoration: ShapeDecoration(
                              shape: RoundedRectangleBorder(
                                borderRadius:
                                BorderRadius.circular(36),
                              ),
                              color: map['realSex'] == 2
                                  ? ThemeColor.mainColor
                                  : Colors.blue),
                          child: IconText(
                            " " + map['age'].toString(),
                            icon: Icon(
                                map['realSex'] == 2
                                    ? Icons.female
                                    : Icons.male,
                                color: Colors.white),
                            iconSize: 12,
                            style: const TextStyle(
                              color: Colors.white,
                              fontSize: 12,
                            ),
                          ),
                        ),
                        // Text(
                        //   map["nation"] ?? "",
                        //   style: const TextStyle(
                        //       color: Color(0xffA7A7A7),
                        //       fontSize: 12,
                        //       fontWeight: FontWeight.w600),
                        // )
                      ],
                    ),
                  ],
                ),
              ),
            ),
          ],
        ),
      )
          : SizedBox(
        height: 500,
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            Image.asset(
              'images/ic_nofriend.png',
              width: 175,
              height: 122,
            ),
          ],
        ),
      ),
    );
  }

  /// 下拉刷新方法,为list重新赋值
  Future<void> _onRefresh() async {
    await Future.delayed(const Duration(seconds: 3), () {});
  }

  /// 上拉加载更多
  Future _getMore() async {
    if (!isLoading) {
      setState(() {
        isLoading = true;
      });
      await Future.delayed(const Duration(seconds: 1), () {});
    }
  }
  Widget _getMoreWidget() {
    return Center(
      child: Offstage(
        offstage: !isLoading,
        child: const Row(
          mainAxisAlignment: MainAxisAlignment.center,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: <Widget>[
            Text(
              '加载中...',
              style: TextStyle(fontSize: 16.0),
            ),
            CircularProgressIndicator(
              strokeWidth: 1.0,
            )
          ],
        ),
      ),
    );
  }

  Widget gettype() {
    return SizedBox(
      height: 500,
      child: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            Image.asset(
              'images/MeLook.png',
              width: 175,
              height: 122,
            ),
            ElevatedButton(
              onPressed: (){
                Navigator.pop(context, 0);
              },
              child: Container(
                height: 38,
                width: 104,
                child: const Text('返回'),
                alignment: Alignment.center,
              ),
              style: ButtonStyle(
                backgroundColor: MaterialStateProperty.all(Colors.white),
                foregroundColor: MaterialStateProperty.all(Color(0xFF7F69D9)),
                elevation: MaterialStateProperty.all(0),
                side: MaterialStateProperty.all(const BorderSide(width: 1,color: Color(0xFF7F69D9))),//边框
                  shape: MaterialStateProperty.all(
                      const StadiumBorder(
                          side: BorderSide(
                            //设置 界面效果
                            style: BorderStyle.solid,
                            color: Color(0xFF7F69D9),
                          )
                      )
                  ),//圆
              ),
            ),
          ],
        ),
      ),
    );
  }
}

